<template>
	<!--滑动优惠券-->
	<div @touchstart="setstoptouch(false)" class="activitiesSlidePic" v-if="(slidePicData.length>0 && env === 'production')|| env === 'edit'">
		<banner style="width:100%; height: 100%; position:relative;" :bounce="true">
			<ul>
				<li v-for="(item,index) in slidePicData" :key="index" v-if="slidePicData">
					<img v-lazy="item.publicityPicture" @click='jumpEvent(item)' src="static/image/demo1.png" />
				</li>
			</ul>
			<div style="clear: both;"></div>
		</banner>
	</div>
</template>

<script>
	import { mapMutations } from "vuex";
	import Banner from '../../real-components/BannerScroll';
	export default {
		props: {
			slidePicData: {
				type: Array,
				default: () => []
			},
		},
		data() {
			return {

			}
		},
		components: {
			Banner
		},
		methods: {
			...mapMutations('xxy', [
				"setstoptouch"
			]),
			jumpEvent(item) {
				if(item.extendField) {
					var urldata = JSON.parse(item.extendField).url.path
					if(urldata) {
						this.$router.push({
							name: "MiddleWare",
							params: {
								pageName: urldata
							}
						})
					}
				}
			},

		},
		computed: {
			env() {
				return window.environment; // 获取是否是编辑状态
			},
		},
		mounted() {

		},
	}
</script>

<style>
	.activitiesSlidePic {
		padding: 0.5rem 0.2rem;
	}
	
	.activitiesSlidePic ul {
		float: left;
		display: flex;
		min-width: 100%;
		position: relative;
	}
	
	.activitiesSlidePic ul li {
		width: 5.9rem;
		height: 2.82rem;
		margin: 0rem 0.1rem;
	}
	
	.activitiesSlidePic ul li img {
		width: 100%;
		height: 100%;
	}
</style>